<#include "/common/defaultEngine.html"/>
<@pageTheme mark="${config.optimize()?string('true', 'false')}">
<@header title="项目报备申请表" libs=["table"]/>

<style>
    table.table-form-title{margin:20px auto 0;}
    table.table-form-title td{text-align: center;border-bottom:0 !important;}
    table.table{width:90%;margin:0 auto;}
    table.table-form-attach{margin-bottom:100px;}
</style>
<div class="row">
    <form id="task-form-complete" action="" method="post">
        <input   name="claimId" value="${claimTaskFrom.id}" type="hidden">

        <table class="table-form-title table" style="margin-top:20px;">
            <tr>
                <td colspan="4" style="border-bottom: 0 !important;">
                    <h2>湖南鑫湘物探工程有限公司</h2>
                    <h2>到账认领</h2>
                </td>
            </tr>
            <tr>
                <td width="15%" colspan="2">

                </td>
                <td class="text-left" colspan="2">
                    <span>项目档案编号：${claimTaskFrom.claimCode}</span>
                </td>
            </tr>
        </table>
        <table class="table-form-head table table-hover table-bordered">
            <tr>
                <th>发起时间</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input class="form-control"  value="${claimTaskFrom.arrivalTime?string('yyyy-MM-dd HH:mm:ss')}" type="text" disabled  >


                        </div>
                    </div>
                </td>
                <th>到账金额</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-8">
                            <input class="form-control"  value="${claimTaskFrom.arrivalAmount}" type="text" disabled  >
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <th>汇款单位</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input  class="form-control" value="${claimTaskFrom.remittanceUnit}" type="text" required disabled>

                        </div>
                    </div>
                </td>
                <th>备注附言</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input  class="form-control" value="${claimTaskFrom.remarks}" type="text" required disabled>

                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <th>已认领金额</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input  class="form-control" value="${claimTaskFrom.claimAmount}" type="text" required disabled>

                        </div>
                    </div>
                </td>
                <th>未认领金额</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input class="form-control"  value="${claimTaskFrom.unclaimedAmount}" type="text" disabled>

                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <th>认领状态</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input class="form-control"  value="${claimTaskFrom.claimStatus}" type="text" disabled>
                            <!--<@f.select name="claimStatus" dictType="claim_status" blankValue=""value="${claimTaskFrom.claimStatus}" />-->

                        </div>
                    </div>
                </td>
                <th>认领合并人</th>
                <td>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input class="form-control"  value="${claimTaskFrom.mergeClaim}" type="text" disabled>

                        </div>
                    </div>
                </td>
            </tr>
        </table>
        <table class="table-form-body table table-hover table-bordered">
            <thead>
            <tr>
                <td colspan="9">
                    <button name="btn-insert" type="button" class="btn btn-primary btn-rounded btn-sm">插入行</button>
                    <button name="btn-copy" type="button" class="btn btn-primary btn-rounded btn-sm">复制行</button>
                    <button name="btn-del" type="button" class="btn btn-primary btn-rounded btn-sm">删除行</button>
                    <button name="btn-del-all" type="button" class="btn btn-primary btn-rounded btn-sm">删除全部</button>
                    <button name="btn-import" type="button" class="btn btn-primary btn-rounded btn-sm">导入数据</button>

                </td>
            </tr>
            <tr>
                <th width="10%">序号</th>
                <th>项目经理</th>
                <th>认领类型</th>
                <th>三联单号</th>
                <th>开具部门</th>
                <th>项目档案编号</th>
                <th>认领时间</th>
                <th>备注</th>
                <th>已结清到账金额</th>
            </tr>
            </thead>
            <tbody name="items">
            <#list recordList as r>
                <tr data-id="${r.id}">

                    <td ><span>${r_index+1} </span></td>
                    <td><@f.tableselect name="ceoName_${r_index+1}" value="${r.ceoName}" labelValue="${r.name}" boxTitle="多选用户信息"  checked=false keyId = "id"
                        tableInfo = "[{field:'username',title:'账号'},{field:'name',title:'姓名',query: true},{field:'compName',title:'归属公司'},
                        {field:'deptName',title:'归属机构'},{field:'email',title:'邮箱'},{field:'mobile',title:'手机号码'},
                        {field:'status',title:'状态',dict:'sys_user_show_hide',query: true},{field:'createTime',title:'创建时间'}]"  placeholder="表格弹出式页面，实用于大数据，搜索选择，" />
                    </td>
                    <!--<td><@f.input name="claimType_${r_index+1}" value="${r.claimType}"  placeholder="认领类型"  required=true/></td>-->
                    <td><@f.select name="claimType_${r_index+1}" dictType="claim_status" blankValue="${r.claimType}" value="${r.claimType}" placeholder="认领类型"  required=true/></td>
                    <!--<td><@f.input name="sanlianNo_${r_index+1}" value="${r.sanlianNo}" placeholder="三联单号" required=true/></td>-->
                    <td> <@f.tableselect name="sanlianNo_${r_index+1}" value="${r.sanlianNo}" labelValue="${r.name}"  url="bpm/claim/sanlianlist"  checked=false
                        boxTitle="三联单号" keyId = "id"
                        tableInfo = "[{field:'sanlianNo',title:'三联单号',query: true},{field:'ceoName',title:'项目经理',query: true},{field:'createTime',title:'创建时间'}]"
                         placeholder="表格弹出式页面，实用于大数据，搜索选择，" /></td>
                    <td><@f.input name="openDepartment_${r_index+1}" value="${r.openDepartment}" placeholder="开具部门" required=true/></td>
                    <!--<td><@f.input name="fileNumber_${r_index+1}" value="${r.fileNumber}" placeholder="项目档案编号" required=true/></td>-->
                    <td> <@f.tableselect name="fileNumber_${r_index+1}" value="${r.fileNumber}" labelValue="${r.fileNumber}"  url="bpm/claim/archivesList"  checked=false
                        boxTitle="项目档案编号"
                        tableInfo = "[{field:'fileNumber',title:'项目档案编号',query: true},{field:'ceoName',title:'项目经理',query: true},{field:'createTime',title:'创建时间'}]"
                        placeholder="表格弹出式页面，实用于大数据，搜索选择，" /></td>
                    <td><@f.input name="claimTime_${r_index+1}" value="${r.claimTime?string('yyyy-MM-dd HH:mm:ss')}" type="date" dataType="datetime" dataFormat="yyyy-MM-dd HH:mm:ss"
                        placeholder="请选择认领时间"  butClass="fa fa-calendar-plus-o" required=true />
                    </td>
                    <td><@f.input name="remarks_${r_index+1}" value="${r.remarks}" placeholder="备注" required=true/></td>
                    <td><@f.input name="putAmount_${r_index+1}" value="${r.putAmount}" placeholder="已结清到账金额" required=true/></td>
                    <@f.input name="id_${r_index+1}"value="${r.id}"  placeholder="认领类型"  required=true type="hidden"/>
                </tr>
            </#list>
            </tbody>


        </table>
        <table class="table-form-attach table table-hover table-bordered">
            <tr>
                <td width="10%" style="border-bottom: 0 !important;">备注</td>
                <td colspan="9" style="border-bottom: 0 !important;">
                    <div class="col-sm-10">
                        <textarea class="form-control" name="remarkss" ></textarea>
                       <!--/ <div id="c_treeselect221" class="panel-collapse collapse"></div>-->
                    </div>
                </td>
            </tr>
        </table>
        <div class="row" style="text-align: center;" id="_addTab">
            <input type="hidden" name="total_items" value="0" />
            <input  name="itemsToRemove" value="" type="hidden">
            <button type="button" class="btn btn-sm btn-primary" onclick="submitForm()"><i class="fa fa-check"></i><@ctx.i18n text = "保存"/></button>&nbsp;
            <button type="button" class="btn btn-sm btn-danger" onclick="opt.modal.closeTab()"><i class="fa fa-reply-all"></i><@ctx.i18n text = "关闭"/></button>
        </div>
    </form>
</div>


<@footer>
<script type="text/javascript">
    var prefix = baseURL + "bpm/achive";
    $("#task-form-complete").validate({
        focusCleanup: true
    });

    //删除的行的ID信息，以数组形式记录
    var itemsToRemove = [];

    function submitForm() {
        var target = $("tbody[name=items]");
        var total = target.children().length;
        $("input[name=total_items]").val(total);
        opt.form.submit();
    }

    function submitHandler() {
        if (opt.validate.form()) {
            opt.operate.saveTab(prefix + "/form", $('#task-form-complete').serialize());
        }
    }

    $("button[name=aaaa]").click(function (e) {
        $("#selectuser222Name").click();
        //e.stopPropagation()
        console.log("aaaa")
    });

    $("button[name=btn-insert]").click(function () {
        var target = $(this).closest("table").find("tbody");
        var indexs=target.children().length; //已有总的行数
        console.log("总共的行数："+indexs);
        var index = indexs + 1; //新插入行的序号
        var tpl = $(target.children().get(0)).prop("outerHTML"); //以第一行为模板进行复制

        tpl = tpl.replaceAll("1", index);
        target.append(tpl);
    });
    $("button[name=btn-del]").click(function () {
        var target = $(this).closest("table").find("tbody");
        var index = target.children().length - 1;
        if(index>0){
            console.log(target.children().get(index))
            var obj = target.children().get(index);
            var dataid = $(obj).attr("data-id");
            console.log(dataid);
            itemsToRemove.push(dataid);
            console.log(itemsToRemove);
            $("input[name=itemsToRemove]").val(itemsToRemove);
            target.children().get(index).remove();
        }
    });
    $("button[name=btn-del-all]").click(function () {
        var target = $(this).closest("table").find("tbody");
        var index = target.children().length - 1;
        for(var i=index; i>0; i--){
            target.children().get(i).remove();
        }
    });
</script>
</@footer>
</@pageTheme>